<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<!DOCTYPE html>
<html lang="en">

    <head>
        <!--our website contains characters from the Unicode character set, a superset of the ASCII character set-->
        <meta charset="utf-8">

        <!--Using the following code snippet would force IE to use the latest rendering engine to render our website-->
        <meta http-equiv="X-UA-Compatible" content="IE=edge">

        <!--We tell the browser to scale our application to the size of window space available:-->
        <!--initial-scale=1 in the code means scale it to 100%-->
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <link rel="stylesheet" type="text/css" href="<c:url value="resources/css/bootstrap.css" />">
        <link rel="stylesheet" type="text/css" href="<c:url value="resources/css/font-awesome.css" />">
        <link rel="stylesheet" type="text/css" href="<c:url value="resources/css/styles.css" />">
        <link rel="stylesheet" type="text/css" href="<c:url value="resources/css/custom-boot.css" />">
        
        <c:if test="${extraStyles != null}">
            <c:forEach items="${extraStyles}" var="extraStyle">
                <link rel="stylesheet" type="text/css" href="<c:url value="${extraStyle}" />">
            </c:forEach>
        </c:if>

        <c:if test="${pageTitle != null}">
            <title>${pageTitle}</title>
        </c:if>
        <c:if test="${pageTitle == null}">
            <title>No title</title>
        </c:if>
    </head>
    <body>

        <div class="navbar navbar-default">
            <div class="container">
                <div id="mynavbar"></div> 
            </div>
        </div>

        <div class="container">
            
            <ol class="breadcrumb">
                <li><a href="/Trabalho_PD/searchtrip.html"><i class="btn btn-primary fa fa-search"></i></a></li>
                <c:if test="${breadcrumb != null}">
                    <c:forEach items="${breadcrumb}" var="breadcrumbItem">
                        <c:if test="${breadcrumbItem.isActive()}">
                            <li class="active"><a href="${breadcrumbItem.getRef()}">${breadcrumbItem.getName()}</a></li>
                        </c:if>
                        <c:if test="${!breadcrumbItem.isActive()}">
                            <li><a href="${breadcrumbItem.getRef()}">${breadcrumbItem.getName()}</a></li>
                        </c:if>
                    </c:forEach>
                </c:if>
                <c:if test="${breadcrumb == null}">
                    <li><a href="#">Empty breadcrumb</a></li>
                </c:if>
            </ol>
        </div>
